<template>
  <div style="display: inline-block;text-align: left;">
    <el-button type="primary" size="mini" @click="openEdit(row_id)">{{$t('table.edit')}}</el-button>
    <el-dialog :visible.sync="dialogTableVisible" v-if="dialogTableVisible" :title="$t('table.edit')" width="50%" top="1%">
      <el-form ref="formData" :model="formData" :rules="rules" label-position="right" label-width="auto">
        <el-form-item :label="$t('table.language_name')" prop="language">
          <el-input label="right" type="text"  v-model="formData.language"></el-input>
        </el-form-item>
        <el-form-item :label="$t('table.language_config')" prop="json">
          <el-input label="right" type="textarea" autosize resize  v-model="formData.json"></el-input>
        </el-form-item>
        <el-form-item align="right">
          <div>
            <el-button type="primary" size="small" @click="submitForm()">{{$t('table.complete')}}</el-button>
            <el-button size="small" @click="closeDia()">{{$t('table.cancel')}}</el-button>
          </div>
        </el-form-item>
      </el-form>
    </el-dialog>
  </div>
</template>

<script>
import axios from "axios";
import store from "@/store";
import { getInfo, editInfo } from "@/api/system/language";

export default {
  props: {
    row_id: {
      type: Number,
      default: function () {
        return null;
      },
    },
  },
  data() {
    return {
      value1: "1594828800000",
      value2: "",
      dialogTableVisible: false,
      formData: {},
      rules: {
        language: [{ required: true, message: "请输入语言名称", trigger: "blur" }],
        json: [
          { required: true, message: "请输入语言信息", trigger: "blur" },
        ]
      },
    };
  },
  methods: {
    openEdit(row_id) {
      (this.dialogTableVisible = true),
        // 根据id获取数据信息
        getInfo(store.getters.token, { id: row_id }).then((res) => {
          this.formData = res.data.data;
          console.log(this.formData.json,'jjjjjjjjjjjjj');
          this.listLoading = false;
        });
    },
    submitForm() {
      console.log("formData---------->", this.formData);

      this.$refs.formData.validate((valid) => {
        if (!valid) {
          return;
        } else {
          // 修改
          editInfo(store.getters.token, this.formData).then((res) => {
            console.log(res);

            if (res.data.status) {
              this.$message.success(this.$t('table.edit_complete'));
              this.$emit("getList");
              this.dialogTableVisible = false;
            } else {
              this.$message.error(this.$t('table.edit_fail'));
            }
          });
        }
      });
    },
    // 关闭弹窗
    closeDia() {
      this.dialogTableVisible = false;
    },
  },
};
</script>

<style scoped>
</style>